import React from 'react'
class SonC extends React.Component {
    
    render() {
        return (
            <div>
                {this.props.msg}
                <button onClick={()=>this.props.changeC('类子组件子传父')}>类子组件子传父</button>
            </div>
        )
    }
}
function SonF({ msg,changeF}) {
    return (
        <div>
            {msg}
            <button onClick={()=>changeF('函数子组件子传父')}>函数子组件子传父</button>
        </div>
    )
}
export class Test8 extends React.Component {
    state = {
        sonC: '类子组件父传子',
        sonF: '函数子组件父传子'
    }
    changeC=(value)=>{
        this.setState({
            sonC:value
        })
    }
    changeF=(value)=>{
        this.setState({
            sonF:value
        })
    }
    render() {
        return (
            <div className="area">
                <h1>8.组件通信-父子</h1>
                <SonC msg={this.state.sonC} changeC={this.changeC}/>
                <SonF msg={this.state.sonF} changeF={this.changeF}/>
            </div>
        )
    }
}